.user-center {
  width: 980px;
  margin: 10px auto 0 auto;

  .center-header {
    display: flex;
    height: 40px;
    background-color: #c9c9c9;

    .tree-nav {
      display: flex;
      flex: 150px 0 0;
      align-items: center;
      background-color: #6e6e6e;
      justify-content: center;
      font-size: 20px;
      font-weight: 900;
      user-select: none;
    }

    .info-nav {
      display: flex;
      flex: 1;
      align-items: center;
      padding-left: 16px;
      user-select: none;
    }
  }

  .center-body {
    display: flex;

    .body-tree {
      display: flex;
      flex: 150px 0 0;

      .tree-list {
        width: 100%;

        > li {
          height: 40px;
          margin: 10px 0;
          background-color: #01AAED;
          border-radius: 3px;
          display: flex;
          justify-content: center;
          align-items: center;

          > a {
            width: 100%;
            height: 100%;
            color: white;
            font-size: 16px;
            font-weight: 700;
            display: flex;
            justify-content: center;
            align-items: center;
            user-select: none;
          }

          &.active {
            background-color: #017fed;
          }
        }
      }
    }
  }
}